<% layout('/layouts/default.html', {title: '考核任务指标表管理', libs: ['dataGrid','fileupload','validate']}){ %>
<div class="main-content">
	<div class="box box-main" id="topId" style="margin-bottom: 10px;" id="box-header1">
<!--		<div class="box-header" style="border-bottom: 10px solid #eee;">-->
<!--			<div style="float: left">-->
<!--				<div class="form-group">-->
<!--					<button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="back()"><i class="fa fa-reply-all"></i> ${text('返回')}</button>-->
<!--				</div>-->
<!--			</div>-->

<!--		</div>-->

		<div class="box box-main" >

			<#form:form id="searchForm" model="${dcSupExamSumQuotaInfo!}" action="${ctx}/home/supIndex/queryTwoPage" method="post" class="form-inline "
			data-page-no="${parameter.pageNo}" data-page-size="${parameter.pageSize!20}" data-order-by="${parameter.orderBy}">

			<div class="searchWord">

				<div class="form-group">
					<label class="control-label">${text('牵头领导')}：</label>
					<div class="control-inline width-160">
						<#form:select path="taskLeader" items="${userList!}" blankOption="true" data-placeholder="请选择牵头领导" itemLabel="userName" itemValue="userCode" class="form-control width-120 " value='${dcSupSpecialWork.contactName!}'/>
						<#form:hidden path="taskLeaderName"/>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label">${text('任务类型')}：</label>
					<div class="control-inline width-160">
						<#form:select path="taskTypeCode" items="${dicts}" blankOption="true" data-placeholder="请选择" itemLabel="dictLabel" itemValue="dictValue" class="form-control width-160"
						value='${dcSupSpecialWork.taskType!}'/>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label">${text('任务信息')}：</label>
					<div class="control-inline width-160">
						<#form:input path="taskTitle" maxlength="200" class="form-control width-160" placeholder="请输入任务标题或内容" value='${dcSupSpecialWork.taskContent!}'/>
						<#form:hidden path="remarks2" value='${dcSupSpecialWork.feedbackContent!}'/>
					</div>
				</div>
				<div class="form-group">
					<label class="control-label">${text('创建时间')}：</label>
					<div class="control-inline width-220">
						<#form:input path="createTaskDate" maxlength="200" class="form-control  width-220" value='${dcSupSpecialWork.createTaskDate!}'/>
					</div>
				</div>
				<div class="form-group">
					<button type="submit" class="btn btn-primary btn-sm">${text('查询')}</button>
					<button onclick="cz();" class="btn btn-default btn-sm">${text('重置')}</button>
				</div>
			</div>



<!--			<div class="tablan">-->
<!--				<span class="tabActive">全部事项</span>-->
<!--				<span>我分管的</span>-->
<!--			</div>-->



			<div class="box-body bootom0" >
				<div class="huizong">

					<p  onclick="statuDetails('')" class="tabActive1">
						<img src="${ctxStatic}/m/images/l1.png">
						<span>任务数</span>
						<span>(&nbsp;</span>
						<span id="allSate" style="color: #575a5e">0</span>
						<span>&nbsp;)</span>
					</p>
					<p  onclick="statuDetails('序时推进')" id="xstj">
						<img src="${ctxStatic}/m/images/l2.png">
						<span> 序时推进</span>
						<span>(&nbsp;</span>
						<span id="zhiSate" style="color: #3e86ff">0</span>
						<span>&nbsp;)</span>
					</p>
					<p  onclick="statuDetails('已完成')" id="ywc">
						<img src="${ctxStatic}/m/images/l3.png">
						<span> 已完成</span>
						<span>(&nbsp;</span>
						<span id="yuqiSate" style="color: #6acfa2">0</span>
						<span>&nbsp;)</span>
					</p>
					<p  onclick="statuDetails('滞后时序')" id="zhsx">
						<img src="${ctxStatic}/m/images/l4.png">
						<span> 滞后时序</span>
						<span>(&nbsp;</span>
						<span id="xushiSate" style="color: #ffc201">0</span>
						<span>&nbsp;)</span>
					</p>
					<p  onclick="statuDetails('逾期未反馈')" id="yqwfk">
						<img src="${ctxStatic}/m/images/l5.png">
						<span> 逾期未反馈</span>
						<span>(&nbsp;</span>
						<span id="wanSate" style="color: #ff7048">0</span>
						<span>&nbsp;)</span>
					</p>
					<p  onclick="statuDetails('未完成')" id="wwc">
						<img src="${ctxStatic}/m/images/l5.png">
						<span> 未完成</span>
						<span>(&nbsp;</span>
						<span id="wanSate1" style="color: #ff7048">0</span>
						<span>&nbsp;)</span>
					</p>
				</div>
			</div>
			<div class="box-body">

				<table id="dataGrid"></table>
				<div id="dataGridPage"></div>
			</div>

		</#form:form>

	</div>

	<div class="box-body" >

		<div style="float: left;">
			<div class="row">
				<div class="col-sm-12 ">
					<div id="tabpanel1"></div>
				</div>
				<div class="col-sm-12 ">
					<div id="tabpanel2"></div>
				</div>
			</div>
		</div>
	</div>
</div>

</div>

<% } %>
<style>
	.bootom0{
		padding-bottom: 0px!important;
	}
	.tabActive {
		color: #1f69e6;
		border-bottom: 2px solid #1f69e6;
	}
	.tablan{
		height: 50px;
		border-bottom: 2px solid #f0f2f5;
		line-height: 50px;
	}
	.tablan span{
		padding-bottom: 13px;
		font-size: 16px;
		margin-right: 20px;
		padding-left: 3px;
		cursor: pointer;

	}
	.searchWord{
		border-bottom: 2px solid #f0f2f5;
	}
	.huizong{
		height: 60px!important;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-pack: distribute;
		justify-content: space-around;
	}
	.huizong p{
		display: flex;
		-webkit-box-shadow: 0 2px 5px 0 hsl(0deg 0% 56% / 40%);
		border-radius: 4px;
		text-align: center;
		/*justify-content: center;*/
		height: 60px;
		width: 18%;
		margin-right: 2vw;
		cursor: pointer;
	}
	.huizong p img{
		margin: 20px 2vw;
		display: inline-block;
		width: 22px;
		height: 22px;
	}
	.huizong p span{
		overflow: hidden;

		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 1vw;
		color: #575a5e;
		font-weight: 600;
		padding-top: 20px;
	}


	.huizong p:last-child {
		margin-right: 0;
	}
	.tabActive1{
		background: #e8eff9!important;
		border: 1px solid #82b1ff!important;
	}
</style>
<script>
	//日期时间范围选择
	laydate.render({
		elem: '#createTaskDate'
		,type: 'date'
		,range: '~'
		,format: 'yyyy-MM-dd'
	});
	function back() {
		// js.closeCurrentTabPage()
		// js.addTabPage(null, "事项清单", "${ctx}/specialWork/dcSupSpecialWork/specialWorkOne", true,true)
		// js.closeCurrentTabPage()
		window.location.replace("${ctx}/specialWork/dcSupSpecialWork/specialWorkOne");
		// js.closeCurrentTabPage()

	}
	// $.ajax({
	// 	type: 'get',
	// 	url: "${ctx}/home/supIndex/queryTwo",
	// 	success: function (res) {
	// 		let twoList = res.list
	// 		for (let i = 0, l = twoList.length; i < l; i++) {
	// 			if (twoList[i].name == '序时推进') {
	// 				$("#zhiSate").text(twoList[i].value)
	// 			}
	// 			if (twoList[i].name == '滞后时序') {
	// 				$("#xushiSate").text(twoList[i].value)
	// 			}
	// 			if (twoList[i].name == '已完成') {
	// 				$("#yuqiSate").text(twoList[i].value)
	// 			}
	// 			if (twoList[i].name == '未完成') {
	// 				$("#wanSate1").text(twoList[i].value)
	// 			}
	// 			if (twoList[i].name == '逾期未反馈') {
	// 				$("#wanSate").text(twoList[i].value)
	// 			}
	// 		}
	//
	// 		$.ajax({
	// 			type: 'post',
	// 			url: "${ctx}/specialWork/dcSupSpecialWork/queryConditionNums",
	// 			success: function (res) {
	// 				$("#allSate").text(res.data)
	//
	//
	// 			}
	// 		});
	//
	//
	// 	}
	// });

	function statuDetails(val){
		$("#remarks2").val(val);
		$('#dataGrid').dataGrid('reloadGrid');
	}
	// $('.tablan span').click(function () {
	// 	var index = $(this).index();
	// 	console.log(index)
	// 	if(index==1){
	// 		$("#taskLeader").val('${@UserUtils.getUser().getUserCode()}')
	// 	}
	// 	$('#dataGrid').dataGrid('reloadGrid');
	// 	$(this).siblings().removeClass("tabActive");
	// 	$(this).addClass("tabActive");
	// })
	$('.huizong p').click(function () {
		var index = $(this).index();
		$(this).siblings().removeClass("tabActive1");
		$(this).addClass("tabActive1");
	})

	$(function (){
		window.location.hash="#topId";
	})



	$('#dataGrid').dataGrid({
		searchForm: $("#searchForm"),
		sortableColumn: false, // 列表不允许排序
		// showCheckbox: true,
		columnModel: [
			{header: '${text("主键")}', name: 'taskId', index: 'a.taskId', width: 150, align: "left", hidden: true},
			{header:'${text("action主键")}', name:'id', width:150, align:"left", hidden:true},
			{header: '${text("督办字号")}', name: 'messageNumber', index: 'a.message_number', width: 150, align: "left"},
			{header: '${text("任务标题")}', name: 'taskTitle', index: 'a.task_title', width: 150, align: "left"},
			{header: '${text("任务类型")}', name: 'taskTypeName', index: 'a.task_type_code', width: 150, align: "left"},
			{header:'${text("任务内容")}', name:'taskContent', index:'a.task_content', width:150, align:"left", formatter: function(val, obj, row, act){
					return '<a href="${ctx}/taskdeploy/dcSupTaskInfo/detailForm?id='+row.taskId+'" class="btnList" data-title="${text("督办任务信息")}">'+(val||'暂无内容')+'</a>';
				}},
			{header: '${text("牵头责任单位")}', name: 'leaderOrgName',  width: 150, align: "left"},
			{header:'${text("牵头领导")}', name:'taskLeaderName', width:150, align:"left"}
		],
		// 加载成功后执行事件
		ajaxSuccess: function(data){

			$.ajax({
				type: 'get',
				url: "${ctx}/home/supIndex/queryTwo",
				data:{"taskLeader":$("#taskLeader").val(),"taskTitle":$("#taskTitle").val(),"taskTypeCode":$("#taskTypeCode").val(),'createTaskDate':$("#createTaskDate").val()},
				success: function (res) {
					let twoList = res.list
					for (let i = 0, l = twoList.length; i < l; i++) {
						if (twoList[i].name == '序时推进') {
							$("#zhiSate").text(twoList[i].value)
						}
						if (twoList[i].name == '滞后时序') {
							$("#xushiSate").text(twoList[i].value)
						}
						if (twoList[i].name == '已完成') {
							$("#yuqiSate").text(twoList[i].value)
						}
						if (twoList[i].name == '未完成') {
							$("#wanSate1").text(twoList[i].value)
						}
						if (twoList[i].name == '逾期未反馈') {
							$("#wanSate").text(twoList[i].value)
						}
					}

					$.ajax({
						type: 'post',
						url: "${ctx}/specialWork/dcSupSpecialWork/queryConditionNums",
						data:{"taskLeader":$("#taskLeader").val(),"taskTitle":$("#taskTitle").val(),"taskTypeCode":$("#taskTypeCode").val(),"createTaskDate":$("#createTaskDate").val()},
						success: function (res) {
							$("#allSate").text(res.data)


						}
					});


				}
			});


		}
	});
	var ta ='${dcSupSpecialWork.feedbackContent!}'
	if(ta){
		if(ta=='序时推进'){
			$("#xstj").siblings().removeClass("tabActive1");
			$("#xstj").addClass("tabActive1");
		}
		if(ta=='已完成'){
			$("#ywc").siblings().removeClass("tabActive1");
			$("#ywc").addClass("tabActive1");
		}
		if(ta=='未完成'){
			$("#wwc").siblings().removeClass("tabActive1");
			$("#wwc").addClass("tabActive1");
		}
		if(ta=='滞后时序'){
			$("#zhsx").siblings().removeClass("tabActive1");
			$("#zhsx").addClass("tabActive1");
		}
		if(ta=='逾期未反馈'){
			$("#yqwfk").siblings().removeClass("tabActive1");
			$("#yqwfk").addClass("tabActive1");
		}
	}
	function cz(){
		searchForm.reset();
		$('#dataGrid').dataGrid('reloadGrid');
	}
</script>